<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
			<div id="page-wrapper">
            <div class="row">
            <div class="col-lg-12">
				<div class="panel panel-default">
                	<div class="panel-heading">
                        修改简历
                    </div>
	                <div class="panel-body">
	                	<form role="form" id="resumeResumeUpdateForm" class="form-horizontal" 
							action="${pageContext.request.contextPath}/resume/resume/update"
							method="post" enctype="multipart/form-data">
										                <div class="form-group">
			                    <label class="col-sm-2 control-label">ID</label>
			                    <div class="col-sm-10">
			                    	<input class="form-control" name="id" readonly value="${formData.id}">
			                    </div>
			                </div>
			                			                			                <div class="form-group">
			                    <label class="col-sm-2 control-label">姓名</label>
			                    <div class="col-sm-10">
			                    	<input class="form-control" placeholder="请输入姓名" name="name" value="${formData.name}">
			                    </div>
			                </div>
			                			                			                			                <div class="form-group">
			                <div class="col-sm-2"></div>
			                <div class="col-sm-10">
				                <button type="submit" class="btn btn-primary">提交</button>
				                <button type="reset" class="btn btn-default">重置</button>
				                <button type="button" class="btn btn-warning" onclick="location.href='${pageContext.request.contextPath}/'">返回</button>
			                </div>
			                </div>
			            </form>
	                </div>
                </div>
                </div>
                <!-- /.panel-body -->
            </div>
                                    <div class="row">
                <div class="col-lg-12">
                    <div class="panel panel-default">
                    	<div class="panel-heading">
                        	Work
                    	</div>
                        <!-- /.panel-heading -->
                        <div class="panel-body">
                            <table width="100%" class="table table-striped table-bordered table-hover" id="resumeResumeworksTable">
                                <thead>
                                    <tr>
                                        <th>ID</th>
                                                                                <th>单位</th>
                                                                                <th>开始日期</th>
                                                                                <th>结束日期</th>
                                                                                <th>position</th>
                                                                                                                        <th>简历</th>
                                                                                <th>操作</th>
                                    </tr>
                                </thead>
                            </table>
                            <!-- /.table-responsive -->
                        </div>
                        <!-- /.panel-body -->
                    </div>
                    <!-- /.panel -->
                </div>
                <!-- /.col-lg-12 -->
            </div>
                                                <div class="row">
                <div class="col-lg-12">
                    <div class="panel panel-default">
                    	<div class="panel-heading">
                        	教育经历
                    	</div>
                        <!-- /.panel-heading -->
                        <div class="panel-body">
                            <table width="100%" class="table table-striped table-bordered table-hover" id="resumeResumeeducationsTable">
                                <thead>
                                    <tr>
                                        <th>ID</th>
                                                                                <th>学校</th>
                                                                                <th>开始日期</th>
                                                                                <th>结束日期</th>
                                                                                <th>学历</th>
                                                                                                                        <th>简历</th>
                                                                                <th>操作</th>
                                    </tr>
                                </thead>
                            </table>
                            <!-- /.table-responsive -->
                        </div>
                        <!-- /.panel-body -->
                    </div>
                    <!-- /.panel -->
                </div>
                <!-- /.col-lg-12 -->
            </div>
                                    <script type="text/javascript">
	   	    $(document).ready(function () {
	   	  		// 设置各字段的验证规则
	   	    	var fields = {};
	   	    		   	    	if (!fields['id']) {
	   	    		fields['id'] = {validators:{}};
	   	    	}
	   	    	fields['id'].validators['notEmpty'] = {
	   	    		message: 'ID不能为空'
	   	    	};
	   	    		   	    		   	    	if (!fields['name']) {
	   	    		fields['name'] = {validators:{}};
	   	    	}
	   	    		   	    		   	  		// 将验证规则应用到表单的字段中
	   			$('#resumeResumeUpdateForm').bootstrapValidator({
		            // 默认错误消息
	   				message: '输入值不合法',
	   				// 设置验证成功或者失败的图标
		            feedbackIcons: {
		                valid: 'glyphicon glyphicon-ok',
		                invalid: 'glyphicon glyphicon-remove',
		                validating: 'glyphicon glyphicon-refresh'
		            },
		            // 设置不同字段的验证规则和错误信息
		            fields: fields
		        });
	   	    	
	   	  		// 关联对象选择器按钮点击事件
	   	    	$('#resumeResumeUpdateForm .input-group-btn').click (function () {
					var nameField = $(this).prev().attr ('name');
					var idField = $(this).prev().prev().attr ('name');
					$('#resumeResumeDialog').remove();
	            	$('body').append ('<div class="modal fade" id="resumeResumeDialog" tabindex="-1" role="dialog" aria-labelledby="resumeResumeSelectorModalLabel"></div>');
	            	// 显示对话框
	            	$('#resumeResumeDialog').load ('${pageContext.request.contextPath}/' + $(this).attr('wo:url'), {
	            		formId : 'resumeResumeUpdateForm',
	            		idField : idField,
	            		nameField : nameField,
	            		singleSelect : $(this).hasClass('woSingleSelect')
	            	},function () {
	            		$('#resumeResumeDialog').modal ('show');
	            	});
				});
	   	  		
	   	    		   	    		   	    	// Work列表
	   	    	var worksTableId = 'resumeResumeworksTable';
            	var cols = [
            		{ "data": "id" , "orderable" : false},
                	                	{ "data": "company" , "orderable" : false},
                	                	{ "data": "startDate" , "orderable" : false},
                	                	{ "data": "endDate" , "orderable" : false},
                	                	{ "data": "position" , "orderable" : false},
                	                	                	{ "data": "resumeName" , "orderable" : false},
                	                    // 下面在"操作"列中添加了修改和删除按钮
                    { "data": null , "orderable" : false, "defaultContent": "<a class='btn btn-primary btn-xs' name='update'>修改</a> <a class='btn btn-primary btn-warning btn-xs' name='delete'>删除</a>"}
                ];
            	var orderIndex = 0;
            	for (var i = 0; i < cols.length; i ++) {
            		if (cols[i].orderable == true) {
            			orderIndex = i;
            		}
            	}
            	// 初始化列表，并触发后台的json数据获取
                var worksTable = $('#' + worksTableId).DataTable({
                	"processing": true, // 显示处理进度
                    "serverSide": true, // 从服务端获取数据
                    "rowId" : 'id',// 设置主键字段名称
                    "ajax": {
                        "url": "${pageContext.request.contextPath}/resume/work/list?resumeId=" + $('#resumeResumeUpdateForm input[name=id]').val(), // 请求列表数据的url
                        "type": "GET" // http方法
                    },
                    "order": [ [ orderIndex, "${r.target.orderableField.order}" ] ] , // 排序
                    "columns": cols
                });
                // 设置列表中按钮的事件
                $('#' + worksTableId + ' tbody').on( 'click', 'a', function () {
                	// this表示a标签对应dom，$(this)将其转为jQuery对象，获取按钮所在行的json对象:WorkDto
                    var data = worksTable.row( $(this).parents('tr') ).data();
                	// 调用修改方法
                	if ($(this).attr('name') == 'update') {
                		updateResumeResumeWorks(data.id);
                	}
                	// 调用删除方法
					if ($(this).attr('name') == 'delete') {
						deleteResumeResumeWorks (data.id);
                	}
                } );
             	// 设置列表多选
                $('#' + worksTableId + ' tbody').on( 'click', 'tr', function () {
                	// 如果有info样式则删除，没有则添加
                	$(this).toggleClass('info');
                } );
             	
                // 添加工具栏按钮，找到设置分页的div，并添加创建和批量删除按钮的a标签
                $('#' + worksTableId + '_length').append (" <a class='btn btn-primary btn-sm' onclick='createResumeResumeWorks();'>创建</a> <a class='btn btn-primary btn-warning btn-sm' onclick='deleteResumeResumeWorkss();'>批量删除</a>");
	   	    		   	    		   	    		   	    	// 教育经历列表
	   	    	var educationsTableId = 'resumeResumeeducationsTable';
            	var cols = [
            		{ "data": "id" , "orderable" : false},
                	                	{ "data": "school" , "orderable" : false},
                	                	{ "data": "startDate" , "orderable" : false},
                	                	{ "data": "endDate" , "orderable" : false},
                	                	{ "data": "grade" , "orderable" : false},
                	                	                	{ "data": "resumeName" , "orderable" : false},
                	                    // 下面在"操作"列中添加了修改和删除按钮
                    { "data": null , "orderable" : false, "defaultContent": "<a class='btn btn-primary btn-xs' name='update'>修改</a> <a class='btn btn-primary btn-warning btn-xs' name='delete'>删除</a>"}
                ];
            	var orderIndex = 0;
            	for (var i = 0; i < cols.length; i ++) {
            		if (cols[i].orderable == true) {
            			orderIndex = i;
            		}
            	}
            	// 初始化列表，并触发后台的json数据获取
                var educationsTable = $('#' + educationsTableId).DataTable({
                	"processing": true, // 显示处理进度
                    "serverSide": true, // 从服务端获取数据
                    "rowId" : 'id',// 设置主键字段名称
                    "ajax": {
                        "url": "${pageContext.request.contextPath}/resume/education/list?resumeId=" + $('#resumeResumeUpdateForm input[name=id]').val(), // 请求列表数据的url
                        "type": "GET" // http方法
                    },
                    "order": [ [ orderIndex, "${r.target.orderableField.order}" ] ] , // 排序
                    "columns": cols
                });
                // 设置列表中按钮的事件
                $('#' + educationsTableId + ' tbody').on( 'click', 'a', function () {
                	// this表示a标签对应dom，$(this)将其转为jQuery对象，获取按钮所在行的json对象:EducationDto
                    var data = educationsTable.row( $(this).parents('tr') ).data();
                	// 调用修改方法
                	if ($(this).attr('name') == 'update') {
                		updateResumeResumeEducations(data.id);
                	}
                	// 调用删除方法
					if ($(this).attr('name') == 'delete') {
						deleteResumeResumeEducations (data.id);
                	}
                } );
             	// 设置列表多选
                $('#' + educationsTableId + ' tbody').on( 'click', 'tr', function () {
                	// 如果有info样式则删除，没有则添加
                	$(this).toggleClass('info');
                } );
             	
                // 添加工具栏按钮，找到设置分页的div，并添加创建和批量删除按钮的a标签
                $('#' + educationsTableId + '_length').append (" <a class='btn btn-primary btn-sm' onclick='createResumeResumeEducations();'>创建</a> <a class='btn btn-primary btn-warning btn-sm' onclick='deleteResumeResumeEducationss();'>批量删除</a>");
	   	    		   	    			    });
	   	    
	   	 		    		   	 	function createResumeResumeWorks () {
	         	location.href = "${pageContext.request.contextPath}/resume/work/create?resumeId=" + $('#resumeResumeUpdateForm input[name=id]').val();
	        }
	         
	        function updateResumeResumeWorks (id) {
	         	location.href = "${pageContext.request.contextPath}/resume/work/update?id=" + id;
	        }
	         
	        function deleteResumeResumeWorks (id) {
	         	if (!confirm ('确定要删除选定的Work吗？')) {
	         		return;
	         	}
	         	$.post ('${pageContext.request.contextPath}/resume/work/delete', {id : id}, function (result) {
		    		if (result.success) {
		    			var tableId = 'resumeResumeworksTable';
				    	var table = $('#' + tableId).DataTable();
				    	// 删除选中的行
		    			table.rows('.info').remove().draw(false);
		    		} 
		    		alert (result.message);
			    });
	        }
	         
	        function deleteResumeResumeWorkss () {
	         	// 获取DataTable
		    	var tableId = 'resumeResumeworksTable';
		    	var table = $('#' + tableId).DataTable();
		    	// 查找样式为info的行，包含所有WorkDto属性
		    	var rows = table.rows('.info').data();
		    	// 判断Work是否有选择
		    	if (rows.length == 0) {
		    		alert ('请选择至少一个Work！');
		    		return;
		    	}
		    	// 让Work确认删除
		    	if (!confirm ('是否删除选中的Work？')) {
		    		return;
		    	}
		    	// 拼接id字符串，多个id逗号隔开
		    	var ids = '';
		    	for (var i = 0; i < rows.length; i ++) {
		    		if (ids != '') {
		    			ids += ',';
		    		}
		    		ids += rows[i].id;
		    	}
		    	// 发送ajax请求，如果成功刷新本页面，否则提示Work操作失败
		    	deleteResumeResumeWorks(ids);
		    }
	           	    		    		   	 	function createResumeResumeEducations () {
	         	location.href = "${pageContext.request.contextPath}/resume/education/create?resumeId=" + $('#resumeResumeUpdateForm input[name=id]').val();
	        }
	         
	        function updateResumeResumeEducations (id) {
	         	location.href = "${pageContext.request.contextPath}/resume/education/update?id=" + id;
	        }
	         
	        function deleteResumeResumeEducations (id) {
	         	if (!confirm ('确定要删除选定的教育经历吗？')) {
	         		return;
	         	}
	         	$.post ('${pageContext.request.contextPath}/resume/education/delete', {id : id}, function (result) {
		    		if (result.success) {
		    			var tableId = 'resumeResumeeducationsTable';
				    	var table = $('#' + tableId).DataTable();
				    	// 删除选中的行
		    			table.rows('.info').remove().draw(false);
		    		} 
		    		alert (result.message);
			    });
	        }
	         
	        function deleteResumeResumeEducationss () {
	         	// 获取DataTable
		    	var tableId = 'resumeResumeeducationsTable';
		    	var table = $('#' + tableId).DataTable();
		    	// 查找样式为info的行，包含所有EducationDto属性
		    	var rows = table.rows('.info').data();
		    	// 判断教育经历是否有选择
		    	if (rows.length == 0) {
		    		alert ('请选择至少一个教育经历！');
		    		return;
		    	}
		    	// 让教育经历确认删除
		    	if (!confirm ('是否删除选中的教育经历？')) {
		    		return;
		    	}
		    	// 拼接id字符串，多个id逗号隔开
		    	var ids = '';
		    	for (var i = 0; i < rows.length; i ++) {
		    		if (ids != '') {
		    			ids += ',';
		    		}
		    		ids += rows[i].id;
		    	}
		    	// 发送ajax请求，如果成功刷新本页面，否则提示教育经历操作失败
		    	deleteResumeResumeEducations(ids);
		    }
	           	    	   			</script>
		</div>